<!-- 编辑弹窗 -->
<template>
  <el-dialog
    :title="isUpdate?'销售发票明细一览':'销售发票明细一览'"
    :visible="visible"
    width="1060px"
    :destroy-on-close="true"
    :lock-scroll="false"
    @open="init"
    @update:visible="updateVisible">
    <el-form
      ref="form"
      :model="form"
      :rules="rules"
      label-width="92px">
      <el-row>
        <el-col :lg="12" :md="12">
          <el-form-item label="客户编码:">
            {{ data.custcode }}
          </el-form-item>
        </el-col>
        <el-col :lg="12" :md="12">
          <el-form-item label="发票代码:">
            {{ data.cgoldtaxDM }}
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :lg="12" :md="12">
          <el-form-item label="发票日期:">
            {{ data.dbilldate }}
          </el-form-item>
        </el-col>
        <el-col :lg="12" :md="12">
          <el-form-item label="客户名称:">
            {{ data.custname }}
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :lg="12" :md="12">
          <el-form-item label="发票号:">
            {{ data.cgoldtaxcode }}
          </el-form-item>
        </el-col>
        <el-col :lg="12" :md="12">
          <el-form-item label="状态:">
            {{ data.statusName }}
          </el-form-item>
        </el-col>
      </el-row>

    </el-form>
    <!-- 数据表格 -->
    <ele-pro-table
      ref="table"
      :datasource="invList"
      :columns="invoiceDetailColumns"
      :selection.sync="selection"
      :pageSize="100"
      :need-page="false"
      height="calc(100vh - 400px)">
      <template slot="toolbar">
        <h6>发票明细</h6>
      </template>
    </ele-pro-table>
    <ele-pro-table
      ref="table"
      :datasource="purchaseRecords"
      :columns="purchaseRecordColumns"
      :selection.sync="selection"
      :pageSize="100"
      :need-page="false"
      height="calc(100vh - 400px)">
      <template slot="toolbar">
        <h6>
          关联购进记录</h6>
      </template>
    </ele-pro-table>
    <ele-pro-table
      ref="table"
      :datasource="invList"
      :columns="ticketRecordColumns"
      :selection.sync="selection"
      :pageSize="100"
      :need-page="false"
      height="calc(100vh - 400px)">
      <template slot="toolbar">
        <h6>

          关联厂票记录</h6>
      </template>
    </ele-pro-table>
    <ele-pro-table
      ref="table"
      :datasource="invList"
      :columns="xmlRecordColumns"
      :selection.sync="selection"
      :pageSize="100"
      :need-page="false"
      height="calc(100vh - 400px)">
      <template slot="toolbar">
        <h6>

          提交xml记录</h6>
      </template>
    </ele-pro-table>

    <div slot="footer">
      <el-button @click="updateVisible(false)">关闭</el-button>
    </div>
  </el-dialog>
</template>

<script>
import {mapGetters} from "vuex";

export default {
  name: 'SysInvoiceRelationEdit',
  computed: {
    ...mapGetters(["permission"]),
  },
  props: {
    // 弹窗是否打开
    visible: Boolean,
    // 修改回显的数据
    data: Object
  },

  data() {
    return {
      // 表单数据
      form: Object.assign({}, this.data),
      url:'/minvoicesrelation/getInvoiceDetailList',
      // 表格列配置
      invoiceDetailColumns: [
        {
          columnKey: 'index',
          type: 'index',
          width: 45,
          align: 'center'
        },
        {
          prop: 'invcode',
          label: '存货编码',
          showOverflowTooltip: true,
          minWidth: 100,
          align: 'left'
        },
        {
          prop: 'vdef12',
          label: '统编代码',
          showOverflowTooltip: true,
          minWidth: 160,
          align: 'center'
        },
        {
          prop: 'invname',
          label: '存货名称',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'pruchfprq',
          label: '生产厂家',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'pruchfprq',
          label: '批号',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'nnumber',
          label: '数量',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'nmny',
          label: '本币无税金额',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'nsummny',
          label: '本币价税合计',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'pruchfprq',
          label: '本币税额',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'pruchfprq',
          label: '原币净含税单价',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'pruchfprq',
          label: '原币无税净单价',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        },
        //   {
        //   columnKey: 'action',
        //   label: '操作',
        //   width: 160,
        //   align: 'center',
        //   resizable: false,
        //   slot: 'action',
        //   fixed: "right"
        // }
      ],
      purchaseRecordColumns: [
        {
          columnKey: 'index',
          type: 'index',
          width: 45,
          align: 'center'
        },
        {
          prop: 'vinvoicedm',
          label: '发票代码',
          showOverflowTooltip: true,
          minWidth: 100,
          align: 'left'
        },
        {
          prop: 'vinvoicecode',
          label: '发票号',
          showOverflowTooltip: true,
          minWidth: 160,
          align: 'center'
        },
        {
          prop: 'custname',
          label: '供应商名称',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'invcode',
          label: '存货编码',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'invname',
          label: '存货名称',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'pruchfprq',
          label: '批号',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'ninvoicenum',
          label: '数量',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'pruchfprq',
          label: '关联时间',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'pruchfprq',
          label: '上传文件',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'pruchfprq',
          label: '传报',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'pruchfprq',
          label: '传报结果',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        },
        //   {
        //   columnKey: 'action',
        //   label: '操作',
        //   width: 160,
        //   align: 'center',
        //   resizable: false,
        //   slot: 'action',
        //   fixed: "right"
        // }
      ],
      ticketRecordColumns: [
        {
          columnKey: 'index',
          type: 'index',
          width: 45,
          align: 'center'
        },
        {
          prop: 'pruchfpdm',
          label: '发票代码',
          showOverflowTooltip: true,
          minWidth: 100,
          align: 'left'
        },
        {
          prop: 'pruchfph',
          label: '发票号',
          showOverflowTooltip: true,
          minWidth: 160,
          align: 'center'
        },
        {
          prop: 'pruchfprq',
          label: '发票开具方',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'pruchfprq',
          label: '发票接收方',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'pruchfprq',
          label: '存货编码',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'pruchfprq',
          label: '存货名称',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'pruchfprq',
          label: '批号',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'pruchfprq',
          label: '数量',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'pruchfprq',
          label: '关联时间',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'pruchfprq',
          label: '传报',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        },

      ],
      xmlRecordColumns: [
        {
          columnKey: 'index',
          type: 'index',
          width: 45,
          align: 'center'
        },
        {
          prop: 'pruchfpdm',
          label: '提交编号',
          showOverflowTooltip: true,
          minWidth: 100,
          align: 'left'
        },
        {
          prop: 'pruchfph',
          label: '提交xml',
          showOverflowTooltip: true,
          minWidth: 160,
          align: 'center'
        },
        {
          prop: 'pruchfprq',
          label: '返回xml',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'pruchfprq',
          label: '处理结果',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'pruchfprq',
          label: '存货名称',
          showOverflowTooltip: true,
          minWidth: 80,
          align: '提示内容'
        }, {
          prop: 'pruchfprq',
          label: '提交时间',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        }, {
          prop: 'pruchfprq',
          label: '提交人',
          showOverflowTooltip: true,
          minWidth: 80,
          align: 'center'
        },
        //   {
        //   columnKey: 'action',
        //   label: '操作',
        //   width: 160,
        //   align: 'center',
        //   resizable: false,
        //   slot: 'action',
        //   fixed: "right"
        // }
      ],
      // 表单验证规则
      rules: {
        invcode: [
          {required: true, message: '请输入', trigger: 'blur'}
        ],
        hsl: [
          {required: true, message: '请输入', trigger: 'blur'}
        ],
      },
      invList: [],
      purchaseRecords:[],
      selection: [],
      // 提交状态
      loading: false,
      // 是否是修改
      isUpdate: false,
    };
  },
  watch: {
    data() {
      if (this.data) {
        this.form = Object.assign({}, this.data);
        this.isUpdate = true;

      } else {
        this.form = {};
        this.isUpdate = false;
      }
    }
  },
  methods: {
    loaddata() {
      this.$http.get('/ygorder/ncsaleinvoice?invoiceNo=' + this.form.salesfph).then(res => {
        if (res.data.code === 0) {
          if (res.data.data.length > 0) {
            this.form.salesfprq = res.data.data[0].fprq;
            this.form.saleszxspbm = res.data.data[0].zxspbm;
            this.form.salesscph = res.data.data[0].scph;
            this.form.salesfphsje = res.data.data[0].fphszje;
            this.form.salesspsl = res.data.data[0].spsl;
          } else {
            this.form.salesfprq = "";
            this.form.saleszxspbm = "";
            this.form.salesscph = "";
            this.form.salesfphsje = "";
            this.form.salesspsl = "";
            this.$message.info("未查询到销项发票信息");

          }
          //加载采购发票明细列表
          this.$http.get('/mpruchinvoice/pruchinvoice?page=1&limit=1000&zxspbm=' + this.form.saleszxspbm + '&scph=' + this.form.salesscph).then(res => {
            if (res.data.code === 0) {
              //加载明细列表
              this.invList = res.data.data;
            } else {
              this.$message.error(res.data.msg);
            }
          }).catch(e => {
            this.$message.error(e.message);
          });
        } else {
          this.$message.error(res.data.msg);
        }
      }).catch(e => {
        this.$message.error(e.message);
      });
    },
    /*打开窗口是加载明细*/
    init() {
      if (!this.isUpdate) {
        this.form.businessid = '';
      }


      this.$http.get('/minvoicesrelation/getPurchaseRecordList?csaleid=' + this.data.csaleid).then(res => {
        if (res.data.code === 0) {
          //加载明细列表
          this.purchaseRecords = res.data.data.records;
        } else {
          this.$message.error(res.data.msg);
        }
      }).catch(e => {
        this.$message.error(e.message);
      });

      this.$http.get('/minvoicesrelation/getInvoiceDetailList?csaleid=' + this.data.csaleid+'&num='+(this.purchaseRecords.ninvoicenum !=null ? this.purchaseRecords:'0')).then(res => {
        if (res.data.code === 0) {
          //加载明细列表
          this.invList = res.data.data.records;
        } else {
          this.$message.error(res.data.msg);
        }
      }).catch(e => {
        this.$message.error(e.message);
      });

    },
    addList() {
      let item = {pruchinvoiceid: '', zxspbm: '', scph: ''};
      this.invList.push(item);

    },
    delList() {
      if (this.invList.length == 0) return;
      if (this.selection.length == 0) {
        this.$message.error('请选择一条需要删除的明细');
        return;
      }
      this.invList.splice(this.invList.findIndex((t) => t.zxspbm === this.selection[0].zxspbm && t.scph === this.selection[0].scph), 1);

    },
    /* 保存编辑 */
    save() {
      if (this.selection.length == 0) {
        this.$message.error('请勾选进项发票后保存');
        return;
      }
      this.$refs['form'].validate((valid) => {
        if (valid) {
          this.loading = true;
          let param = {
            invoicesrelation: this.form,
            invoicesrelationLines: this.selection
          };
          this.$http.post(this.isUpdate ? '/minvoicesrelation/update' : '/minvoicesrelation/create', param).then(res => {
            this.loading = false;
            if (res.data.code === 0) {
              this.$message.success(res.data.msg);
              if (!this.isUpdate) {
                this.form = {};
              }
              this.updateVisible(false);
              this.$emit('done');
            } else {
              this.$message.error(res.data.msg);
            }
          }).catch(e => {
            this.loading = false;
            this.$message.error(e.message);
          });
        } else {
          return false;
        }
      });
    },
    /* 更新visible */
    updateVisible(value) {
      this.$emit('update:visible', value);
    }
  }
}
</script>

<style scoped>
.el-row {
  margin-bottom: 0px;
}
</style>
